<%--
  Created by IntelliJ IDEA.
  User: Administrator
  Date: 2025/8/15 星期五
  Time: 10:29
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>

<!DOCTYPE html>
<html>

<head>
    <base href="${pageContext.request.contextPath}/" />
    <title>襄阳蓝芯智能化办公系统</title>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link href="static/bootstrap-3.3.5/css/bootstrap.css" rel="stylesheet">
    <link href="static/bootstrapvalidator/css/bootstrapValidator.css"
          rel="stylesheet">
    <style>
        /*定义类名为.thead-blue的样式*/
        .thead-blue {
            color: #fff;
            font-weight: bold;
            background-color: #337ab7;
        }
    </style>
    <script src="static/jquery/jquery-1.10.2.min.js"></script>
    <script src="static/bootstrap-3.3.5/js/bootstrap.js"></script>
    <script src="static/bootstrapvalidator/js/bootstrapValidator.js"></script>
</head>
<body>

<!-- 搜索 -->
<div class="panel panel-primary">
    <div class="panel-heading">
        <h4 class="panel-title">我的待审批单据</h4>
    </div>
    <div class="panel-body">
        <form action="approval/listMyApproval" id="seachform" method="post"
              class="form-horizontal" role="form">
            <div class="form-group">
                <div class="col-md-4">
                    <label for="docNo" class="col-md-4 control-label">申请单号</label>
                    <div id="docNo" class="col-md-8">
                        <input type="text" name="docNo" class="form-control"
                               placeholder="请输入单据编号" value="">
                        <input type="hidden" name="page" id="page" value="1">
                        <input type="hidden" name="pageSize" id="pageSize" value="5">
                    </div>
                </div>
                <div class="col-md-4">
                    <label for="docType" class="col-md-4 control-label">申请人</label>
                    <div id="docType" class="col-md-8">
                        <input type="hidden" id="proposer" name="proposer"
                               value="">
                        <div class="input-group">
                            <input type="text" id="empName" name="emp.empName"
                                   readonly="readonly" class="form-control" placeholder="请选择申请人"
                                   value=""> <span
                                class="input-group-btn">
									<button class="btn btn-info" type="button" data-toggle="modal"
                                            data-target="#selectempModal">请选择</button>
								</span>
                        </div>
                    </div>
                </div>

                <div class="col-md-4">
                    <div class="col-md-12">
                        <button type="button" onclick="searchBtn()" class="btn btn-success">搜索待审批单据</button>
                    </div>
                </div>
            </div>
        </form>
    </div>
</div>


<!-- 列表 -->
<div class="panel panel-primary">
    <table class="table table-bordered table-hover">
        <thead>
        <tr class="thead-blue" align="center">
            <td>单据编号</td>
            <td>单据类型</td>
            <td>申请人</td>
            <td>提交时间</td>
            <td>审批</td>
        </tr>
        </thead>
        <tbody>
        <c:forEach items="${myApprovals}" var="approval">
            <tr align="center">
                <td>${approval.docNo}</td>
                <td>
                <c:forEach items="${docTypes}" var="docType">
                    ${approval.docType eq docType.docType ? docType.docTypeName:""}
                </c:forEach>
                </td>
                <td>
                    ${approval.proposerName}
                </td>
                <td>
                    ${approval.submitDate}
                </td>
                <td>
                    <a type="button" href="judge/approval/toApproval?oid=${approval.oid}" class="btn btn-success btn-xs">去审批</a>
                </td>
            </tr>
        </c:forEach>

        </tbody>
    </table>
</div>

<!-- 分页 -->
<div class="input-group col-md-6 col-md-offset-3">
    <div class="row">
        <div class="btn-group">
            <button onclick="gotoPage(1,5)"
                    class="btn btn-primary" type="button">首页</button>

            <button class="btn btn-primary disabled" type="button">上一页</button>



            <button class="btn btn-primary disabled" type="button">当前第1/1页</button>

            <div class="btn-group">
                <button type="button" class="btn btn-primary dropdown-toggle"
                        data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                    每页显示5条 <span class="caret"></span>
                </button>
                <ul class="dropdown-menu">
                    <li><a href="javascript:gotoPage(1,5)">每页显示5条</a></li>
                    <li><a href="javascript:gotoPage(1,10)">每页显示10条</a></li>
                    <li><a href="javascript:gotoPage(1,15)">每页显示15条</a></li>
                    <li><a href="javascript:gotoPage(1,20)">每页显示20条</a></li>
                </ul>
            </div>

            <button class="btn btn-primary disabled" type="button">共1条记录</button>


            <button class="btn btn-primary disabled" type="button">下一页</button>


            <button
                    onclick="gotoPage(1,5)"
                    class="btn btn-primary" type="button">尾页</button>
        </div>
    </div>
</div>


<br>
<br>
<br>



<!-- 模态框（Modal） -->
<div class="modal fade" id="confirmModal" tabindex="-1" role="dialog" aria-labelledby="confirmModalLabel" aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">
                    &times;
                </button>
                <h4 class="modal-title" id="confirmModalLabel">
                    提示
                </h4>
            </div>
            <div class="modal-body">
                确认删除吗？
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">关闭
                </button>
                <button type="button" id="subconfirm" class="btn btn-primary">
                    提交更改
                </button>
            </div>
        </div>
    </div>
</div>
<script>
    $(document).ready(function(){
        $("#subconfirm").click(function(){
            deleteConfirm();
            $('#confirmModal').modal('hide');
        });
    });
</script>


<!-- 模态框（Modal） -->
<div class="modal fade" id="alertMsgModal" tabindex="-1" role="dialog" aria-labelledby="alertMsgModalLabel" aria-hidden="true">
    <div class="modal-dialog modal-xs">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">
                    &times;
                </button>
                <h4 class="modal-title" id="alertMsgModalLabel">
                    提示
                </h4>
            </div>
            <div class="modal-body" id="alertmsg">
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
            </div>
        </div>
    </div>
</div>


<div class="modal fade" id="selectempModal" tabindex="-1" role="dialog" aria-labelledby="selectempModalLabel" aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                <h4 class="modal-title" id="selectempModalLabel">选择员工</h4>
            </div>
            <div class="modal-body">
                <form action="" class="form-horizontal" role="form">
                    <div class="form-group">
                        <label for="dept" class="col-md-4 control-label">所属部门</label>
                        <div class="col-md-5">
                            <select name="dept" class="form-control" id="dept">
                                <option value="">--请选择--</option>
                            </select>
                        </div>
                    </div>
                    <div class="form-group">
                        <label for="job" class="col-md-4 control-label">所属职位</label>
                        <div class="col-md-5">
                            <select name="job" class="form-control" id="job">
                                <option value="">--请选择--</option>
                            </select>
                        </div>
                    </div>
                    <div class="form-group">
                        <label for="emp" class="col-md-4 control-label">员工信息</label>
                        <div class="col-md-5">
                            <select name="emp" class="form-control" id="emp" size="10">
                            </select>
                        </div>
                    </div>
                </form>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
                <button type="button" id="sub" class="btn btn-primary">确认选择</button>
            </div>
        </div>
    </div>
</div>

<script>
    $(document).ready(function(){
        $.getJSON("dept/listDeptUseSelect",function(listdept){
            var dept = $("#dept")[0];
            dept.options.length=1;
            for(var i=0;i<listdept.length;i++){
                var d = listdept[i];
                dept.options.add(new Option(d.deptName,d.oid));
            }
        });

        $("#dept").change(function(){
            $("#job")[0].options.length=1;
            $("#emp")[0].options.length=0;
            if(this.value==""){
                return;
            }
            $.getJSON("dept/listDeptJobUseSelect",{deptid:this.value},function(listjob){
                var job = $("#job")[0];
                job.options.length=1;
                for(var i=0;i<listjob.length;i++){
                    var job1 = listjob[i];
                    job.options.add(new Option(job1.name,job1.oid));
                }
            });

            $.getJSON("emp/listEmpUseSelete",{deptid:$("#dept").val()},function(emps){
                var emp = $("#emp")[0];
                emp.options.length=0;
                for(var i=0;i<emps.length;i++){
                    var e = emps[i];
                    emp.options.add(new Option(e.empName,e.oid));
                }
            });
        });

        $("#job").change(function(){
            $.getJSON("emp/listEmpUseSelete",{deptid:$("#dept").val(),jobid:this.value},function(emps){
                var emp = $("#emp")[0];
                emp.options.length=0;
                for(var i=0;i<emps.length;i++){
                    var e = emps[i];
                    emp.options.add(new Option(e.empName,e.oid));
                }
            });
        });

        $("#sub").click(function(){
            var eid=$("#emp").val();
            if(eid!=null){
                var empName=$("#emp option:selected").text();
                setempvalue(eid,empName);
                $('#selectempModal').modal('hide');
            }else{
                alert("请选择员工");
            }

        });

        $('#selectempModal').on('show.bs.modal',function() {
            $("#dept").val("");
            $("#job")[0].options.length=1;
            $("#emp")[0].options.length=0;
        });
    });
</script>






<script type="text/javascript">
    $(document).ajaxError(function(event,xhr) {
        if(xhr.status=="403"){//没有权限
            document.location.href = xhr.getResponseHeader("url");
        }else if(xhr.status!="200"){
            //alert("服务器错误!");
            console.log("服务器错误!");
        }
    });
</script>

<script type="text/javascript">
    function setempvalue(eid, empName) {
        $("#proposer").val(eid);
        $("#empName").val(empName);
    }
</script>


</body>
<script type="text/javascript">
    function gotoPage(page,pageSize){
        $("#page").val(page);
        $("#pageSize").val(pageSize);
        $("#seachform").submit();
    }
    function searchBtn(){
        $("#page").val(1);
        $("#seachform").submit();
    }


</script>
</html>
